<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
    <link rel="stylesheet" href="../../css/bootstrap.css">
    <link rel="stylesheet" href="../../bootstrap-icons-1.13.1/bootstrap-icons.min.css">
    <script src="../../js/jquery-1.4.2.js"></script>

    <script src="../../js/bootstrap.bundle.min.js"></script>
</head>
<body>
    <div class="container">
        <h1 class="text-center m-4">欢迎注册</h1>
        <form action="" method="get">
            <div class="form-group m-4">
                <label for="user_name" class="col-form-label col-3 text-right">用户名</label>
                <input type="text" name="username" placeholder="请输入用户名" id="user_name" class="form-control-sm col-6">
            </div>
             <div class="form-group m-4">
                <label for="passward" class="col-form-label col-3 text-right">密码</label>
                <input type="text" name="username" placeholder="请输入密码" id="passward" class="form-control-sm col-6">
            </div>
            <div class="form-group m-4 row">
                <div class="col-3 text-right">性别</div>
               <div class="col-6 row">
                    <div class="form-check col-2">
                        <input type="radio" value="男" name="gender" class="form-check-input" id="gender_m">
                        <label for="gender_m" class="form-check-label text-right">男</label>
                    </div>
                     <div class="form-check col-2 offset-2">
                        <input type="radio" name="gender" value="女" class="form-check-input" id="gender_w">
                        <label for="gender_w" class="form-check-label text-right" >女</label>
                    </div>
               </div>
            </div>
        </form>
    </div>
</body>
</html>